﻿@page "/docs/helpers/colors"

<Seo Canonical="/docs/helpers/colors" Title="Blazorise Color Utilities" Description="Here is a list of contextual classes that can be applied to most of your components:" />

<DocsPageTitle>
    Color Utilities
</DocsPageTitle>

<DocsPageParagraph>
    Here is a list of contextual classes that can be applied to most of your components:
</DocsPageParagraph>

<Alert Color="Color.Info" Visible="true">
    <AlertDescription>Keep in mind: All elements have a color <Code>None</Code> specified by default.</AlertDescription>
</Alert>

<DocsPageSection>
    <DocsPageSectionHeader Title="Color">
        <UnorderedList>
            <UnorderedListItem><Code>None</Code></UnorderedListItem>
            <UnorderedListItem><Code>Primary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Secondary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Success</Code></UnorderedListItem>
            <UnorderedListItem><Code>Danger</Code></UnorderedListItem>
            <UnorderedListItem><Code>Warning</Code></UnorderedListItem>
            <UnorderedListItem><Code>Info</Code></UnorderedListItem>
            <UnorderedListItem><Code>Light</Code></UnorderedListItem>
            <UnorderedListItem><Code>Dark</Code></UnorderedListItem>
            <UnorderedListItem><Code>Link</Code></UnorderedListItem>
        </UnorderedList>
    </DocsPageSectionHeader>
</DocsPageSection>

<DocsPageSection>
    <DocsPageSectionHeader Title="Background">
        <UnorderedList>
            <UnorderedListItem><Code>None</Code></UnorderedListItem>
            <UnorderedListItem><Code>Primary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Secondary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Success</Code></UnorderedListItem>
            <UnorderedListItem><Code>Danger</Code></UnorderedListItem>
            <UnorderedListItem><Code>Warning</Code></UnorderedListItem>
            <UnorderedListItem><Code>Info</Code></UnorderedListItem>
            <UnorderedListItem><Code>Light</Code></UnorderedListItem>
            <UnorderedListItem><Code>Dark</Code></UnorderedListItem>
            <UnorderedListItem><Code>White</Code></UnorderedListItem>
            <UnorderedListItem><Code>Transparent</Code></UnorderedListItem>
        </UnorderedList>
    </DocsPageSectionHeader>
</DocsPageSection>

<DocsPageSection>
    <DocsPageSectionHeader Title="TextColor">
        <UnorderedList>
            <UnorderedListItem><Code>None</Code></UnorderedListItem>
            <UnorderedListItem><Code>Primary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Secondary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Success</Code></UnorderedListItem>
            <UnorderedListItem><Code>Danger</Code></UnorderedListItem>
            <UnorderedListItem><Code>Warning</Code></UnorderedListItem>
            <UnorderedListItem><Code>Info</Code></UnorderedListItem>
            <UnorderedListItem><Code>Light</Code></UnorderedListItem>
            <UnorderedListItem><Code>Dark</Code></UnorderedListItem>
            <UnorderedListItem><Code>Body</Code></UnorderedListItem>
            <UnorderedListItem><Code>Muted</Code></UnorderedListItem>
            <UnorderedListItem><Code>White</Code></UnorderedListItem>
            <UnorderedListItem><Code>Black50</Code></UnorderedListItem>
            <UnorderedListItem><Code>White50</Code></UnorderedListItem>
        </UnorderedList>
    </DocsPageSectionHeader>
</DocsPageSection>

<DocsPageSection>
    <DocsPageSectionHeader Title="SnackbarColor">
        <UnorderedList>
            <UnorderedListItem><Code>None</Code></UnorderedListItem>
            <UnorderedListItem><Code>Primary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Secondary</Code></UnorderedListItem>
            <UnorderedListItem><Code>Success</Code></UnorderedListItem>
            <UnorderedListItem><Code>Danger</Code></UnorderedListItem>
            <UnorderedListItem><Code>Warning</Code></UnorderedListItem>
            <UnorderedListItem><Code>Info</Code></UnorderedListItem>
            <UnorderedListItem><Code>Light</Code></UnorderedListItem>
            <UnorderedListItem><Code>Dark</Code></UnorderedListItem>
        </UnorderedList>
    </DocsPageSectionHeader>
</DocsPageSection>

